<div class="modal-header">
<%--	<g:form id="formNuevoPerfil" name="formNuevoPerfil" action="nuevoPerfil" controller="perfil" class="modal-body">--%>
	<g:form id="formMubbia" name="formMubbia" controller="nuevaMubbia" class="modal-body">
		<div class="tabbable">
	      <ul class="nav nav-pills" id="myTab">
	        <li class="active"><a href="#crear" data-toggle="tab">Crear Mubbia</a></li>
	        <li class=""><a href="#arreglar" data-toggle="tab">Descripci&oacute;n</a></li>
	        <li class=""><a href="#otrosdatos" data-toggle="tab">Otros datos</a></li>
	        <li class=""><a href="#participantes" data-toggle="tab">Participantes</a></li>
	      </ul> <!-- /tabs -->
	    </div>
		<div class="tab-content" style="height: 300px;">
		   <div id="crear" class="tab-pane active">
				<div class="input-prepend span4 noLeft">
	    			<label class="control-label" for="titulo">T&iacute;tulo:</label>
	    			<g:textField class="span4" name="titulo" id="titulo" type="text" maxLength="60" 
	    			placeholder="Escriba un título aquí" value="${mubbiaInstance?.titulo}" />
				</div>
		   </div>
		   <div id="arreglar" class="tab-pane">
				<div class="tab-pane active">
					<div class="input-prepend span4 noLeft">
		    			<label class="control-label" for="descripcion">Descripci&oacute;n:</label>
		    			<g:textArea id="descripcion" name="descripcion" rows="10" class="span4" value="${mubbiaInstance?.descripcion}"></g:textArea>
					</div>
			   </div>
		   </div>
		   <div id="otrosdatos" class="tab-pane">
			   <div class="input-append date">
			   		<label class="control-label" for="fechaFinalizacion">Fecha finalizaci&oacute;n:</label>
					<input  name="fechaFinalizacion" id="fechaFinalizacion" class="span2" size="16" type="text" value="${mubbiaInstance?.fechaFinalizacion?.format('dd/MM/yyyy')}">
					<input  name="fechaHidden" id="fechaHidden" size="16" type="hidden" value="${mubbiaInstance?.fechaFinalizacion?.format('dd/MM/yyyy')}">
				</div>
				<div class="separator"></div>
				<div class="input-prepend span3 noLeft">
	    			<label class="control-label" for="tags">Tags: &nbsp;</label>
	    			<span class="add-on"><i class="icon-tags"></i></span>
	    			<g:textField class="span4" name="tags" id="tags" type="text"
	    			maxLength="100" placeholder="Ingrese los tags para su Mubbia" value="${tags}" />
			    </div>
				<div class="separator"></div>
		    	<div class="input-prepend noLeft">
	    			<label class="control-label" for="categoria">Categor&iacute;a:&nbsp;&nbsp;</label>
	    			<g:select class="span1" id="categoria" name="categoria.id" from="${categorias}" optionKey="id" required="" value="${mubbiaInstance?.categoria?.id}" class="many-to-one"/>
			    </div>
		   </div>
		   <div id="participantes" class="tab-pane">
				<div class="tab-pane active">
					<div class="input-prepend" style="margin-left: 30px;">
				    	<span>
				    		<label class="control-label" alt="Elija un minimo y m&aacute;ximo de participantes para su Mubbia">¿Tiene limite de participantes?&nbsp;&nbsp;</label>
<%--				    		<g:checkBox style="margin-bottom: 5px;" name="tieneLimiteParticipantes" id="tieneLimiteParticipantes" checked="${mubbiaInstance?.tieneLimiteParticipantes}" />--%>
<%--				    		<g:checkBox style="margin-bottom: 5px;" name="tieneLimiteParticipantes" id="tieneLimiteParticipantes" onClick="muestraLimiteParticipantes(false);" checked="${mubbiaInstance?.tieneLimiteParticipantes}" />--%>
			    		</span>
		    			<div id="MinimoYMaximo">
				    		<div class="span2 noLeft">
				    			<label class="control-label" for="minimoParticipantes">M&iacute;nimo&nbsp;&nbsp;</label>
				    			<g:textField class="span1" name="minimoParticipantes" id="minimoParticipantes" value="" maxLenght="10" value="${mubbiaInstance?.minimoParticipantes}"/>
			    			</div>
			    			<div class="span2 noLeft">
				    			<label class="control-label" for="maximoParticipantes">&nbsp;&nbsp;M&aacute;ximo&nbsp;&nbsp;</label>
				    			<g:textField class="span1" name="maximoParticipantes" id="maximoParticipantes" value="" maxLenght="10" value="${mubbiaInstance?.maximoParticipantes}"/>
						    </div>
					    </div>
				    </div>
<%--					<script type="text/javascript">muestraLimiteParticipantes(true);</script>--%>
			   </div>
		   </div>
		</div><!-- /.tab-content -->
		<div class="separator"></div>
		<div align="right">
<%--			<g:submitToRemote class="btn btn-primary btn-large span3 centrar" id="btnCrearCuenta2" name="btnCrearCuenta2" controller="perfil" action="nuevoPerfil" update="divFormNuevoPerfil" asynchronous="false" after="actualizarNavBar();" value="Crear Mubbia" />--%>
			<g:actionSubmit class="btn btn-primary btn-large span3 centrar" id="btnCrearMubbia" name="btnCrearMubbia" value="Crear Mubbia" action="previsualizarMubbia"  />
		</div>
	</g:form>

</div>